<template>
	<view class="animation-slide-right" :style="[{animationDuration: '0.2s'}]">
		<cu-custom bgColor="bg-gradual-green" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">报事报修</block>
			<block slot="right"><text class="text-bold" @click="submit()">提交</text></block>
		</cu-custom>
		<form>
			<view class="cu-form-group margin-top">
				<view class="title">标题</view>
				<input v-model="reportForm.title" placeholder="简要介绍报事报修内容" name="input"></input>
			</view>
			<view class="cu-form-group ">
				<view class="title">申报类型</view>
				<picker @change="PickerChange" :value="index" :range="picker">
					<view class="picker">
						{{index>-1?picker[index]:'选择类型'}}
					</view>
				</picker>
			</view>
			<view class="cu-form-group align-start margin-top">
				<view class="title">详细描述</view>
				<textarea maxlength="-1" :disabled="modalName!=null" @input="textareaInput"
					placeholder="现场情况详细描述"></textarea>
			</view>
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				index: -1,
				picker: ['维修', '电视网络'],
				reportForm: {},
				time: '12:01',
				date: '2018-12-25',
				imgList: [],
				modalName: null,
				textareaAValue: '',
				textareaBValue: ''
			};
		},
		methods: {
			PickerChange(e) {
				
				this.reportForm.type = this.index = e.detail.value
			},
			TimeChange(e) {
				this.time = e.detail.value
			},
			DateChange(e) {
				this.date = e.detail.value
			},
			ChooseImage() {
				uni.chooseImage({
					count: 4, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {
						uni.uploadFile(res)
						console.log(res)
						if (this.imgList.length != 0) {
							this.imgList = this.imgList.concat(res.tempFilePaths)
						} else {
							this.imgList = res.tempFilePaths
						}
					}
				});
			},
			ViewImage(e) {
				uni.previewImage({
					urls: this.imgList,
					current: e.currentTarget.dataset.url
				});
			},
			DelImg(e) {
				uni.showModal({
					title: '召唤师',
					content: '确定要删除这段回忆吗？',
					cancelText: '再看看',
					confirmText: '再见',
					success: res => {
						if (res.confirm) {
							this.imgList.splice(e.currentTarget.dataset.index, 1)
						}
					}
				})
			},
			textareaInput(e) {
				this.reportForm.content = e.detail.value
			},
			submit() {
				this.reportForm.submiter = this.$store.getters.userid;
				console.log('报修表单', this.reportForm)
				this.$http.post('/property/znzfRepairment/add', this.reportForm).then((res)=>{
					if (res.data.success) {
						this.$tip.success('申报成功!')
						this.$Router.replaceAll({
							name: 'repairList'
						})
					} else {
						this.$tip.alert(res.errMsg);
					}
				})

			}
		}
	}
</script>

<style lang='scss'>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}
</style>
